//登录点击-显示
var loginBth =document.querySelector('header .member > div')
loginBth.onclick=function(){
    var loginDialog = document.querySelector('section.login')
    console.log(loginDialog)
    loginDialog.style.visibility= 'visible'
}
//登录点击-隐藏
var loginCloseBth =document.querySelector('section.login i.icon-close')
loginCloseBth.onclick=function(){
    var loginDialog=document.querySelector('section.login')
    loginDialog.style.visibility= 'hidden'
}
//蓝色区域拖拽
var loginBlueBox =document.querySelector('section.login .menu')
loginBlueBox.onmousedown =function(evt){
    var olde =evt ||window.event
    document.onmousemove =function(evt){
        var e=evt ||window.event
        var left=e.clientX - olde.offsetX
        var top=e.clientY - olde.offsetY
        //限制边界
        if (left<0) left =0
        if (top<0) top =0
        var loginDialog =document.querySelector('section.login .item')
        var maxLeft =(window.innerWidth || document.documentElement.clientWidth) -loginDialog.offsetWidth
        var maxTop =(window.innerHeight || document.documentElement.clientHeight) -loginDialog.offsetHeight
        if (left >maxLeft) left=maxLeft
        if (top >maxTop) top=maxTop
        loginDialog.style.position ='absolute'
        loginDialog.style.left =left + 'px'
        loginDialog.style.top =top + 'px'
    }
    document.onmouseup =function(){
        document.onmousemove=null
    }
}

//登录倒计时
var num =10
var captchaBth = document.querySelector('section.login .captcha')
captchaBth.onclick=function(){

var CaptchObj=document.querySelector('section.captcha')
CaptchObj.style.visibility= 'visible'
document.querySelector('section.captcha i.icon-close').onclick = function(){
    CaptchObj.style.visibility= 'hidden'
}
var dragBtn =document.querySelector('section.captcha .drag .btn')
dragBtn.onmousedown = function(){
    document.onmousemove =function(evt){
        var e =evt ||window.event
        // var left =e.clientX -430 -dragBtn.offsetWidth/2
        var left =e.clientX -565 -dragBtn.offsetWidth/2
        dragBtn.style.left = left +'px'
        document.querySelector('section.captcha .check img:nth-of-type(2').style.left=left+'px'
    }
    document.onmouseup =function(){
        document.onmousemove=null
        var value = parseInt(dragBtn.style.left)
        console.log(value)
        if(value >=260 && value<=265){
            captchaBth.innerText =num+'秒后重发'
            captchaBth.disabled =true
            t= setInterval(function() {
                if(num<=1){
                    clearInterval(t)
                    captchaBth.innerText ='重新发送'
                    num=5
                    captchaBth.disabled = false
                    return
                }
                //重置页面文字
                num--
                captchaBth.innerText = num+'秒后重发'
            },1000)
            document.querySelector('section.captcha').style.visibility='hidden'
        }
        dragBtn.style.left='0px'
        document.querySelector('section.captcha .check img:nth-of-type(2').style.left='0px'
    }
}
return
}
//登录表单验证
var loginSubmitBtn =document.querySelector('section.login .submit')
loginSubmitBtn.onclick = function(){
    var isOk =0
    var mobileObj = document.querySelector('.mobile')
    if (mobileObj.value =='' || mobileObj.value.length !=11 || !Number(mobileObj.value)){
        document.querySelector('section.login .form > p:nth-of-type(3)').innerText='手机格式有误'
    }else{
        isOk++
        document.querySelector('section.login .form >p:nth-of-type(3)').innerText=''
    }
    var passwordObj=document.querySelector('.password')
    if (passwordObj.value =='' || passwordObj.value.length !=4 || !Number(passwordObj.value)){
        document.querySelector('section.login .form > p:nth-of-type(4)').innerText='验证码只能是4位数'
    }else{
        isOk++
        document.querySelector('section.login .form >p:nth-of-type(4)').innerText=''
    }
    if (isOk==2){
        alert('登陆成功')
    }
}